<template>
    <el-table :data="newList" border style="width: 100%">
        <el-table-column prop="mType" label="消息类别" />
        <el-table-column prop="title" label="消息详情" />
        <el-table-column prop="sendTime" label="发送时间" />
    </el-table>
    <!-- 分页 -->
    <table>
        <tr>
            <td>
                <el-pagination v-model:current-page="page.pageindex" v-model:page-size="page.pagesize" prev-text="上一页"
                    next-text="下一页" :page-sizes="[3, 5, 7]" :background="true" layout="total, slot,sizes"
                    :total="page.pagecount">
                    ，当前是{{ page.pageindex }}/{{ page.totalcount }}页，每页{{ page.pagesize }}条
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="page.pageindex" v-model:page-size="page.pagesize" prev-text="上一页"
                    next-text="下一页" :page-sizes="[3, 5, 7]" :background="true" layout=" slot, prev, pager, next"
                    :total="page.pagecount">
                    <el-button :disabled="page.pageindex == 1" @click="page.pageindex = 1">首页</el-button>
                </el-pagination>
            </td>
            <td>
                <el-pagination v-model:current-page="page.pageindex" v-model:page-size="page.pagesize" prev-text="上一页"
                    next-text="下一页" :page-sizes="[3, 5, 7]" :background="true" layout=" slot, jumper"
                    :total="page.pagecount">
                    <el-button :disabled="page.pageindex == page.totalcount"
                        @click="page.pageindex = page.totalcount">尾页</el-button>
                </el-pagination>
            </td>
        </tr>
    </table>
</template>

<script setup lang='ts'>
import { ref, onMounted, reactive, watch } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import http from '../../http.js';
import axios from 'axios';

onMounted(() => {
    getMessage()
})

const page = reactive({
    pageindex: 1,
    pagesize: 10,
    pagecount: 0,
    totalcount: 0
})

watch(page, () => {
    getMessage()
})

const newList = ref([])
const getMessage = () => {
    axios.get(http.zblnb + '/erpcp/api/Message/SendMessageSelect', {
        params: {
            pageindex: page.pageindex,
            pagesize: page.pagesize
        }
    })
        .then(res => {
            newList.value = res.data.data.list
            console.log(newList.value)
            page.pagecount = res.data.data.pagecount
            page.totalcount = res.data.data.totalcount
        })
}

</script>

<style></style>